<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>后台管理面板</title>
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    {include file="common/top" /}
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">
    <div class="content-wrapper" style="margin-left: 0 !important;">
        <!--页眉-->
        <section class="content-header">
            <h1>会员列表</h1>
        </section>
        <!--内容开始-->
        <section class="content">
            <div class="col-sm-12 col-xs-12 padding_0">
                <div class="box">
                    <div class="box-header with-border">
                        <h3 class="box-title">会员信息</h3>
                    </div>
                    <!-- /.box-header -->
                    <div class="box-body">
                        <table class="table table-bordered">
                            <tbody>
                            <tr>
                                <th style="width: 10px">UID</th>
                                <th style="width: 100px">头像</th>
                                <th style="text-align: center">性别</th>
                                <th style="text-align: center">微信名</th>
                                <th style="text-align: center">权限</th>

                            </tr>
                            {volist name='userInfo' id="vo"}
                            <tr>
                                <td style="text-align: center">{$vo.id}</td>
                                <td style="text-align: center"><img src="{$vo.headimgurl}" style="height: 86px;width: 86px;" alt=""></td>
                                <td style="text-align: center">
                                    {if $vo.sex==1 }男{else/}女{/if}
                                </td>
                                <td style="text-align: center">{$vo.nickname}</td>
                                <td style="text-align: center">
                                    <button class="btn btn-danger" data-user_id="{$vo.id}" data-wechat_name="{$vo.nickname}"
                                            data-real_name="{$vo.real_name}" data-department="{$vo.department}" data-role="{$vo.role}"
                                            onclick="edit(this)" data-toggle="modal"
                                            data-target="#apply-edit">分配权限
                                    </button>
                                    <button class="btn btn-success user_del" user_id="{$vo.id}">
                                        删除会员
                                    </button>
                            </tr>
                            {/volist}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </section>
        <!-- right col -->
    </div>
    <!-- /.row (main row) -->

    </section>
    <!--内容结束-->
    <!-- 修改菜单模态框开始 -->
    <div class="modal" id="apply-edit">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <!--<h4 class="h4">设置员工信息</h4>-->
                    <!--<button type="button" class="close" data-dismiss="modal">&times;</button>-->
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title">
                        设置员工信息
                    </h4>
                </div>
                <div class="modal-body">

                    <div class="box-body">
                        <div class="row">
                            <div class="col-md-9">
                                <div class="form-group">
                                    <label>微信名</label>
                                    <input class="form-control" type="text" name="wechat_name" readonly>
                                </div>
                            </div>
                        </div>
                        <form>
                            <input type="hidden" name="user_id">
                            <input type="hidden" name="role">
                            <div class="row">
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <label>部门</label>
                                        <input class="form-control" type="text" name="department">
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <label>姓名</label>
                                        <input class="form-control" type="text" name="real_name">
                                    </div>
                                </div>
                            </div>


                            <div class="row">
                                <div class="col-md-9">
                                    <div class="form-group">
                                        <label>分配角色</label>
                                        <select class="form-control select2 select2-hidden-accessible" multiple=""
                                                data-placeholder="请选择" style="width: 100%;" tabindex="-1"
                                                aria-hidden="true" >
                                        </select>
                                    </div>
                                    <!-- /.col -->
                                </div>
                                <!-- /.row -->

                            </div>


                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary submit">确定</button>
                    </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- 修改菜单模态框结束 -->

    </div>
</div>
{include file="common/bottom" /}

<script>
    function edit(obj) {
        var wechat_name = $(obj).attr('data-wechat_name');
        var real_name = $(obj).attr('data-real_name');
        var department = $(obj).attr('data-department');
        var user_id = $(obj).attr('data-user_id');
        var role = $(obj).attr('data-role');
        $("input[name='wechat_name']").val(wechat_name);
        $("input[name='real_name']").val(real_name);
        $("input[name='department']").val(department);
        $("input[name='user_id']").val(user_id);
        var new_role = role.split(',');
        $(".select2").val(new_role).trigger('change');
    }
</script>
<!--引入JS-->
<!--<script>-->
<!--$('.wyc_edit').click(-->
<!--function () {-->
<!--$('#apply-edit').modal('show');-->
<!--}-->
<!--);-->
<!--</script>-->
<!--<script>-->
<!--function edit(obj) {-->
<!--$('#apply-edit').modal('show');-->
<!--}-->
<!--</script>-->
<script type="text/javascript" src="/static/plugins/webuploader-0.1.5/webuploader.js"></script>
<script>
    $(function () {
        var data = [{id: 1, text: '普通会员'}];
        //Initialize Select2 Elements
        $('.select2').select2(
            {
                data: data,
                placeholder: '请选择',
                allowClear: true
            });
        $(".select2").val(['2','3']).trigger('change');
        //Date range picker
        $('#reservation').daterangepicker()
        //Date range picker with time picker
        $('#reservationtime').daterangepicker({timePicker: true, timePickerIncrement: 30, format: 'MM/DD/YYYY h:mm A'})
        //Date range as a button
        //Colorpicker
    })
</script>
<script src="/static/lib/layer/layer.js" type="text/javascript"></script>
<script>
    $(function () {

        $('.submit').click(function () {
            var role =$(".select2").val();
            $("input[name='role']").val(role);
            $.ajax({
                url: "<?php echo url('admin/users/index'); ?>",
                type: "post",
                data: $('form').serialize(),
                dataType: 'json',
                success: function (data) {
                    if (data.code == 1) {
                        layer.msg(data.msg, {
                            icon: 6,
                            time: 2000
                        }, function () {
                            location.href = data.url;
                        })
                    } else {
                        layer.open(
                            {
                                title: '修改失败',
                                content: data.msg,
                                icon: 5,
                                anim: 6
                            }
                        );
                    }
                }
            });
            return false;
        })
    })
    $('.user_del').click(function () {
        var id = $(this).attr('user_id');
        layer.confirm('确定要删除吗？',{
            title: '会员删除',
            icon:3,
        },function (index) {
            layer.close(index);
            $.ajax({
                url:"{:url('admin/users/delete')}",
                type:"post",
                data:{"userID":id},
                dataType: 'json',
                success:function (data) {
                    if(data.code==1){
                        layer.msg(data.msg,{
                            icon:6,
                            time: 2000
                        },function () {
                            location.href = data.url;
                        })
                    }else {
                        layer.open({
                            title:'删除失败！',
                            content: data.msg,
                            icon:5,
                            anim: 6
                        })
                    }
                }
            })
        })

    })
</script>
<!--  -->
</body>
</html>